@use "sass:math";

.satri-col {
	width: 100%;
	box-sizing: border-box;

	&::before {
		content: "";
		display: block;
	}
}

[class*="satri-col-"] {
	float: left;
	box-sizing: border-box;
}

.satri-col-0 {
	display: none;
	width: 0%;
}

@for $i from 1 through 24 {
	.satri-col-push-#{$i},
	.satri-col-pull-#{$i} {
		position: relative;
	}
}

@for $i from 1 through 24 {
	$w: math.div(100%, 24);

	.satri-col-#{$i} {
		width: $w * $i;
	}

	.satri-col-offset-#{$i} {
		margin-left: $w * $i;
	}

	.satri-col-pull-#{$i} {
		right: $w * $i;
	}

	.satri-col-push-#{$i} {
		left: $w * $i;
	}
}
